<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="UTF-8">
		<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
		<meta http-equiv="X-UA-Compatible" content="ie=edge">
		<link rel="stylesheet" href="../css/common.css">
		<title>我的收藏</title>
		<style>
			.collect {
				padding: 0 1rem;
			}

			.classBox {
				display: flex;
				padding: 1rem 0;
				border-bottom: 1px solid #E4E4E4;
				align-items: center;
			}

			.classLeft {
				width: 9.0625rem;
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 1rem .5rem;
				box-sizing: border-box;
				font-size: 0.75rem;
			}

			
			.classIntro {
				width: 100%;
			}

			.className {
				color: #fff;
				font-weight: bold;
			}

			.fudao {
				color: #ddd;
			}

			.classLeft img {
				width: 1.4rem;
			}

			.classRight {
				margin-left: 1rem;
				width: 53%;
			}

			.r_title {
				font-weight: bold;
				margin-bottom: .5rem;
			}

			.r_num {
				float: right;
				color: #999;
			}

			.price {
				float: left;
			}

			.price img {
				height: 1rem;
			}

			.price span {
				font-size: 0.75rem;
				font-weight: bold;
			}
		</style>
	</head>
	<body>
		<div class="tabsBox">
			<div class="topTab">
				<div class="tabLeft">
					<img src="../assets/left_J.png" >
				</div>
				<div class="tabCenters">我的收藏</div>
				<!-- <div class="tabRight">收益说明</div> -->
			</div>
		</div>
		<div class="collect">
			<div class="classBox">
				<div class="classLeft pur">
					<div class="classIntro">
						<div class="className">抖音100W粉丝</div>
						<div class="fudao">外教一对一辅导</div>
					</div>
					<img src="../assets/add.png">
				</div>
				<div class="classRight">
					<div class="r_title">抖音100W粉丝</div>
					<div class="r_stydy cleardrift">
						<div class="price">
							<img src="../assets/wallet.png">
							<span>2999.00</span>
						</div>
						<div class="r_num">323人正在学</div>
					</div>
				</div>
			</div>
			
			<div class="classBox">
				<div class="classLeft blue">
					<div class="classIntro">
						<div class="className">抖音100W粉丝</div>
						<div class="fudao">外教一对一辅导</div>
					</div>
					<img src="../assets/add.png">
				</div>
				<div class="classRight">
					<div class="r_title">抖音100W粉丝</div>
					<div class="r_stydy cleardrift">
						<div class="price">
							<img src="../assets/wallet.png">
							<span>2999.00</span>
						</div>
						<div class="r_num">323人正在学</div>
					</div>
				</div>
			</div>
			
			<div class="classBox">
				<div class="classLeft green">
					<div class="classIntro">
						<div class="className">抖音100W粉丝</div>
						<div class="fudao">外教一对一辅导</div>
					</div>
					<img src="../assets/add.png">
				</div>
				<div class="classRight">
					<div class="r_title">抖音100W粉丝</div>
					<div class="r_stydy cleardrift">
						<div class="price">
							<img src="../assets/wallet.png">
							<span>2999.00</span>
						</div>
						<div class="r_num">323人正在学</div>
					</div>
				</div>
			</div>
			<div class="classBox">
				<div class="classLeft red">
					<div class="classIntro">
						<div class="className">抖音100W粉丝</div>
						<div class="fudao">外教一对一辅导</div>
					</div>
					<img src="../assets/add.png">
				</div>
				<div class="classRight">
					<div class="r_title">抖音100W粉丝</div>
					<div class="r_stydy cleardrift">
						<div class="price">
							<img src="../assets/wallet.png">
							<span>2999.00</span>
						</div>
						<div class="r_num">323人正在学</div>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="../js/jquery-3.4.1.min.js"></script>
	<script type="text/javascript" src="../js/common.js"></script>
</html>
